<!DOCTYPE html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style type="text/css"></style>
</head>
<body>
    <h1>节点访问-节点属性</h1>
    <ul id="books" title="这是一个书单"><!--66666666666-->
        <li>程序员必看书单</li>
        <li>第一阶段:</li>
        <li id="b1">《细说php》</li><li>《MySQL必知必会》</li><!-- 这两本推荐购买-->
        <li>《javascript权威指南》</li>
        <li>第二阶段:</li>
        <li>《教你怎么不生气》</li>
        <li>《佛经》</li>
        <li>《老子》</li>
        <li>《沉默的愤怒》</li>
        <li>第三阶段:</li>
        <li>《颈椎病康复指南》</li>
        <li>《腰椎间盘突出日常护理》</li>
        <li>《高血压降压宝典》</li>
        <li>《精神病症状学》</li>
        <li>第四阶段:</li>
        <li>《活着》</li>
    </ul>

    <script>
        // document
        console.dir(document);
        var books = document.getElementById('books');
        // element
        console.dir(books);
        // attr
        console.dir(books.getAttributeNode('title'));

        console.log(books.childNodes.length); // 35+

        // for (var i = 0; i < books.childNodes.length; i++) {
        //     // text
        //     // comment
        //     console.dir(books.childNodes[i]);
        // }
        // 子元素节点
        console.log(books.children.length);

        console.log('books的第一个子节点: ' , books.firstChild);
        console.log('books的最后一个子节点: ' , books.lastChild);


        console.log('books的父节点: ' , books.parentNode);
        console.log('books的父元素节点: ' , books.parentElement);


        console.log('b1的前一个素节点: ' , b1.previousSibling);
        console.log('b1的后一个素节点: ' , b1.nextSibling);

        console.log('document的nodeName:  ' + document.nodeName);
        console.log('document的nodeValue:  ' + document.nodeValue);
        console.log('document的nodeType:  ' + document.nodeType);

        console.log('books的nodeName:  ' + books.nodeName);
        console.log('books的nodeValue:  ' + books.nodeValue);
        console.log('books的nodeType:  ' + books.nodeType);

    </script>



</body>
</html>




